<template>
    <!-- 案例展示 -->
    <div class="boxs margin_top">
        <headers></headers>
        <div class="detail" :class="!ismobile ? 'pce' : 'mobe'">
            <!-- <div class="title">{{ listitem.name }}</div>
            <div class="title" v-if="listitem.created_datetime">{{ listitem.created_datetime.substring(0, 10) }}</div> -->
            <div class="contentbox">
                <div class="content" v-html="zixundetail">

                </div>
            </div>
            <!-- 
            <div class="dianzan">
                <div @click="getlike">
                    <span class="iconfont icon-hezuoshangjia shouzhi"></span>
                    <span>{{ listitem.like_count }}</span>
                </div>
                <div>
                    <span class="iconfont icon-zhengyan"></span>
                    <span>{{ listitem.view_count }}</span>
                </div>
            </div> -->
        </div>

        <!-- <p style=\"box-sizing: inherit; margin-top: 0px; margin-bottom: 0.8em; max-width: 100%; color: rgb(42, 51, 60); font-family: &quot;Segoe UI&quot;, &quot;Lucida Grande&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, FreeSans, Arimo, &quot;Droid Sans&quot;, &quot;wenquanyi micro hei&quot;, &quot;Hiragino Sans GB&quot;, &quot;Hiragino Sans GB W3&quot;, Roboto, Arial, sans-serif; text-wrap: wrap; background-color: rgb(255, 255, 255); line-height: 1.5em;\"><a href=\"https://www.smartcode.vip/product/list-150.html\" target=\"_blank\" title=\"商品防伪标签\" style=\"box-sizing: inherit; text-decoration-line: none; color: rgb(98, 168, 234); background-color: transparent; touch-action: manipulation; max-width: 100%;\"><span style=\"box-sizing: inherit; max-width: 100%; font-family: 宋体, SimSun;\"><strong style=\"box-sizing: inherit; max-width: 100%;\">商品防伪标签</strong></span></a><span style=\"box-sizing: inherit; max-width: 100%; font-family: 宋体, SimSun;\">行业研究的主要核心研究内容包括以下几个方面：</span></p><ol class=\" list-paddingleft-2\" style=\"box-sizing: inherit; margin-bottom: 1rem; max-width: 100%; color: rgb(42, 51, 60); font-family: &quot;Segoe UI&quot;, &quot;Lucida Grande&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, FreeSans, Arimo, &quot;Droid Sans&quot;, &quot;wenquanyi micro hei&quot;, &quot;Hiragino Sans GB&quot;, &quot;Hiragino Sans GB W3&quot;, Roboto, Arial, sans-serif; text-wrap: wrap; background-color: rgb(255, 255, 255);\"><li><p style=\"box-sizing: inherit; margin-top: 0px; margin-bottom: 0.8em; max-width: 100%; line-height: 1.5em;\"><span style=\"box-sizing: inherit; max-width: 100%; font-family: 宋体, SimSun;\">市场环境信息：根据PEST分析模型和行业研究经验，全面深入分析国际国内商品防伪标签行业的经济环境，分析行业政策及相关配套趋势，判断企业、投资者、企业家和行业的发展现状和未来趋势，通过企业营销努力适应当前市场环境的变化，达到预期目标；</span></p></li><li><p style=\"box-sizing: inherit; margin-top: 0px; margin-bottom: 0.8em; max-width: 100%; line-height: 1.5em;\"><span style=\"box-sizing: inherit; max-width: 100%; font-family: 宋体, SimSun;\">行业竞争环境分析：依托综合数据库资源，分析市场竞争和市场供求状况。为安全行业提供发展规模、速度、产业集中度、产品结构、所有制结构、区域结构、产品价格、效益等重要信息，为安全行业研究预测未来几年安全行业市场的供求发展趋势；</span></p></li><li><p style=\"box-sizing: inherit; margin-top: 0px; margin-bottom: 0.8em; max-width: 100%; line-height: 1.5em;\"><span style=\"box-sizing: inherit; max-width: 100%; font-family: 宋体, SimSun;\">行业微观市场环境分析:了解商品防伪标签行业目前的市场情况、市场规模和市场变化竞争，为行业内相关企业和投资者提供企业规模、财务状况、技术研发、营销状况、投资并购、产品类型和市场份额；</span></p></li><li><p style=\"box-sizing: inherit; margin-top: 0px; margin-bottom: 0.8em; max-width: 100%; line-height: 1.5em;\"><span style=\"box-sizing: inherit; max-width: 100%; font-family: 宋体, SimSun;\">行业客户需求分析:主要研究商品防伪标签行业消费者和下游行业的购买需求规模、议价能力和需求特征等。</span></p></li></ol><p><br/></p> -->

        <bottoms></bottoms>
    </div>
</template>

<script>


import bottoms from "./modle/bottoms.vue"
import headers from "./modle/headers.vue"
import titleline from "./modle/titleline.vue"

export default {
    name: 'HelloWorld',
    components: {
        headers,
        bottoms,
        titleline
    },
    data() {
        return {
            listitem: {},
            ismobile: "",
            zixundetail: ""
        }
    },
    created() {
        this.getdetail()
    },
    methods: {
        getlike() {

            this.$api.post(
                "/api/PortalHome/like_notice",
                {
                    id: this.$route.query.id
                },
                (r) => {
                },
                (f) => { }
            );
        },
        getdetail() {
            this.$api.get(
                "/api/PortalHome/get_notice_details",
                {
                    id: this.$route.query.id
                },
                (r) => {


                    // let listitem;
                    // r.DATA.map(item => {
                    //     if (item.id == this.$route.query.id) {
                    //         listitem = item
                    //     }
                    // });
                    this.listitem = r.DATA
                    // // console.log(zixundetail)
                    let content = r.DATA.contents
                    content = content.replace('"', "'")
                    content = content.replace('"', "'")
                    content = content.replace("style='", 'style="')
                    content = content.replace("'>", '">')
                    this.zixundetail = this.escape2Html(content)
                    // console.log(this.zixundetail)
                },
                (f) => { }
            );
        }, // 获取公司资讯
        get_zixun() {
            this.$api.get(
                "/api/PortalHome/get_notice",
                {
                    notice_type: 1
                },
                (r) => {
                    let listitem;
                    r.DATA.map(item => {
                        if (item.id == this.$route.query.id) {
                            listitem = item
                        }
                    });
                    this.listitem = listitem
                    // console.log(zixundetail)
                    listitem.contents = listitem.contents.replace('"', "'")
                    listitem.contents = listitem.contents.replace('"', "'")
                    listitem.contents = listitem.contents.replace("style='", 'style="')
                    listitem.contents = listitem.contents.replace("'>", '">')
                    this.zixundetail = this.escape2Html(listitem.contents)
                    // console.log(this.zixundetail)
                },
                (f) => { }
            );
        },

        //富文本反转义html
        escape2Html(str) {
            var arrEntities = { 'lt': '<', 'gt': '>', 'nbsp': ' ', 'amp': '&', 'quot': "'" };
            return str.replace(/&(lt|gt|nbsp|amp|quot);/ig, function (all, t) {
                return arrEntities[t];
            });
        },

        //富文本转义html
        html2Escape(str) {
            return sHtml.replace(/[<>&"]/g, function (c) {
                return { '<': '&lt;', '>': '&gt;', '&': '&amp;', '"': '&quot;' }[c];
            });
        }
    },
    mounted() {
        this.ismobile = this.isMobile()
        let that = this;
        window.addEventListener('resize', function () {
            that.ismobile = that.isMobile()
        });

    }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
.contentbox {
    min-height: 40vh;
    padding: 0 20px;
    margin-top: 2rem;
}

.title {
    font-size: 1.3rem;
    text-align: center;
    color: #009aff;
    padding: 0 2rem;
    font-weight: bold;
    margin-top: 0.5rem;
}

.dianzan {
    width: 100%;
    overflow: hidden;
    padding-right: 1rem;
    color: rgb(81, 81, 81);

    >div {
        float: right;
        margin-left: 0.9rem;

        >span:nth-child(1) {
            font-size: 1.2rem;
        }

        >span:nth-child(2) {
            font-size: 1.1rem;
        }
    }

    >div:nth-child(1) {
        >span:nth-child(1) {
            font-size: 1.1rem;
        }
    }
}

.mobe {
    margin-top: 2rem;
}

.pce {
    margin-top: 2rem;
    width: 1000px;
    margin: 0 auto;
    margin-top: 15rem;
    margin-bottom: 8rem;

    .content {
        margin-top: 2rem;
        margin-bottom: 2rem;
    }

    .title {
        font-size: 1.6rem;
    }

    .dianzan {
        padding-right: 0rem;

        >div {
            float: right;
            margin-left: 0.9rem;

            >span:nth-child(1) {
                font-size: 1.5rem;
            }

            >span:nth-child(2) {
                font-size: 1.4rem;
            }
        }

        >div:nth-child(1) {
            >span:nth-child(1) {
                font-size: 1.3rem;
            }
        }
    }

}
</style>
